<!--
  - Copyright (c) 2018.
  - 北京九思金信科技有限公司对该文件内容保留所有权利。
  - 未经许可，不得私自拷贝、传播、发布、引用该文件内容，违者将被追究法律责任。
  -->

<template>
  <el-select v-model="typeInfo"
             filterable
             clearable
             value-key="messageTypeId"
             :placeholder="placeholder"
             @focus="loadTypeList"
             @change="changeType">
    <el-option v-for="typeInfo in typeList" :key="typeInfo.messageTypeId" :label="typeInfo.messageTypeName"
               :value="typeInfo"/>
  </el-select>
</template>

<script>
  export default {
    name: "MessageTypeSelect",
    props: ['value','placeholder'],
    created() {
      this.loadTypeList()
    },
    data() {
      return {
        typeInfo: null,
        typeList: []
      }
    },
    methods: {
      changeType() {
        this.$emit('input', this.typeInfo.messageTypeId)
        this.$emit('change', this.typeInfo)
      },
      // 获取消息类型数据
      loadTypeList() {
        const url = '/joys-rest/joys-admin/messageType/list'
        this.$http.get(url).then(resp => {
          this.typeList = resp.data
          this.mapTypeInfo()
        }, resp => {
          this.$message.error(resp.data)
        })
      },
      mapTypeInfo() {
        this.typeList && this.typeList.find(messageTypeInfo => {
          if (messageTypeInfo.messageTypeId == this.value) {
            this.typeInfo = messageTypeInfo
            this.$emit('matched', this.typeInfo)
            return true
          } else {
            return false
          }
        })
      }
    }
  }
</script>

<style scoped>

</style>
